<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div id="app">
			<!-- 3、调用全局组件 -->
			<quanju-component></quanju-component>
		</div>
		
		<!-- 2、定义全局组件的模板 -->
		<template id="quanjuTemplate">
			<div>
				{{name}}
			</div>
		</template>
		
		<script src="../../js/vue.js" type="text/javascript" charset="utf-8"></script>
		
		
		<script type="text/javascript">
			//1、定义全局组件
			//组件id，组件实体
			Vue.component("quanjuComponent",{
				//1.1、全局组件的数据
				data:function(){
					return{
						name: 'lisi'
					}
				},
				//1.2、全局组件的模板
				template:"#quanjuTemplate",
				//1.3、全局组件方法
				methods:{}
			})
			
			
			
			const vue = new Vue({
				el: "#app",
				data: {},
				methods: {},
				mounted() {
					
				},
				mounted() {
					
				}
			})
		</script>
		
	</body>
</html>
